<template>
    <div @click="see">
        <!-- 当前数据:{{ $store.state.num }} -->
        <!-- <div>{{ newList }}</div> -->
        <div>{{ $store.getters.getterList(25) }}</div>
        <div>名字：{{ $store.state.info.name }}</div>
        <div>年龄：{{ $store.state.info.age }}</div>
        <div>身高：{{ $store.state.info.height }}</div>
        <button @click="addHeight">添加身高</button>
        <button @click="actionAdd">vuex异步</button>
        <button @click="getModule">获取模块里面的数据</button>
    </div>
</template>

<script>
export default {
    methods: {
        actionAdd() {
            console.log(this.$store);
            // aaa;
            this.$store.commit('aaa');
        },
        see() {
            // this.$store.state.state里面的数据
            console.log(this.$store.state.num);
        },
        addHeight() {
            this.$store.commit('addHeights');
        },
        getModule() {
            console.log(this.$store);
        }
    },
    computed: {
        newList() {
            return this.$store.state.list.filter((item) => item.age > 20); //filter过滤
            // return this.$store.getters.getterList(24);
        }
    }
};
</script>

<style></style>
